import { DOCUMENT } from "@angular/common";
import { ImgOverlayComponent } from "./img-overlay/img-overlay.component";
import { Component, OnInit, Input, Inject } from "@angular/core";
import { MatDialog } from "@angular/material/dialog";
import { ImgStoreData } from 'src/storage/.config/store.type';

@Component({
  selector: "app-album-list",
  templateUrl: "./album-list.component.html",
  styleUrls: ["./album-list.component.scss"]
})
export class AlbumListComponent implements OnInit {
  @Input() content: string[] = [];
  @Input() storage: ImgStoreData["data"][0];
  constructor(
    public dialog: MatDialog,
    @Inject(DOCUMENT) private doc: Document
  ) {}

  ngOnInit(): void {}

  clickImg(imgSrc: string,) {
    this.dialog.open(ImgOverlayComponent, {
      data: { imgSrc, storage: this.storage },
      width: this.doc.body.clientWidth > 900 ? "60%" : "80%"
    });
  }
}
